<template>
  <el-table :data="voucherModel.getList()" style="width: 100%;" @row-click="row => $emit('log', row)">
    <el-table-column :label="plugin.lang('voucher.type')">
      <template #default="scope">
        <el-tag :type="scope.row.type ? '' : 'success'">{{ plugin.langTm('voucher.type_text')[scope.row.type] }}</el-tag>
      </template>
    </el-table-column>
    <el-table-column :label="plugin.lang('voucher.code')" prop="code" />
    <el-table-column :label="plugin.lang('voucher.money')" align="center">
      <template #default="scope">
        <el-link type="primary" href="javascript:;">{{ money(scope.row.money) }}</el-link>
      </template>
    </el-table-column>
    <el-table-column :label="plugin.lang('voucher.expire_time')" width="150">
      <template #default="scope">
        <span v-if="scope.row.expire_time">{{  time.date(scope.row.expire_time) }}</span>
      </template>
    </el-table-column>
    <el-table-column :label="plugin.lang('voucher.status')" align="center">
      <template #default="scope">
        <el-tag :type="scope.row.status ? 'warning' : 'info'" effect="plain">{{ plugin.langTm('voucher.status_text')[scope.row.status] }}</el-tag>
      </template>
    </el-table-column>
    <el-table-column :label="plugin.lang('voucher.status_money')" align="center">
      <template #default="scope">
        <el-link type="warning" v-if="Number(scope.row.status_money)" href="javascript:;">{{ money(scope.row.status_money) }}</el-link>
      </template>
    </el-table-column>
    <el-table-column :label="plugin.lang('voucher.time')" width="150">
      <template #default="scope">
        {{ time.date(scope.row.created_at) }}
      </template>
    </el-table-column>
    <el-table-column fixed="right" width="200">
      <template #default="scope">
        <div style="text-align: right">
          <el-button v-if="!scope.row.status" type="warning" size="small" @click.stop="$emit('status', scope.row)">{{ plugin.lang('voucher.button') }}</el-button>
          <el-dropdown @command="command => $emit(command, scope.row)">
            <el-button type="primary" size="small" style="margin-left: 10px" @click.stop>{{ lang.t('common.active') }}<i class="iconfont icon-arrow-down" style="font-size:12px;padding-left:5px"></i></el-button>
            <template #dropdown>
              <el-dropdown-menu>
                <el-dropdown-item command="print">{{ lang.t('common.print') }}</el-dropdown-item>
                <el-dropdown-item command="delete" v-if="!scope.row.status">{{ lang.t('common.delete') }}</el-dropdown-item>
              </el-dropdown-menu>
            </template>
          </el-dropdown>
        </div>
      </template>
    </el-table-column>
  </el-table>
</template>

<script>
import app from '@/app'
import voucherModel from '../../model/voucher'

export default {
  setup() {
    voucherModel.get()

    return {
      lang: app.lang,
      money: app.money,
      time: app.time,
      plugin: app.plugin.index,
      voucherModel
    }
  }
}
</script>